import React, { PureComponent } from 'react'
import { Button, Space } from 'antd'
import indexStyle from '../index.less'
import HomeSearch from '../search/Search'
import { PlusCircleOutlined } from '@ant-design/icons'
import { showLoginModule } from '../reducers/reducer'
import { connect } from 'react-redux'

class HeaderTool extends PureComponent {

  onSearch = () => {

  }

  login = () => {
    debugger
    this.props.login()
  }

  render () {
    const { height } = this.props
    return (
      <div style={{ height }}>
        <Space size={'large'}>
          <a className={indexStyle.img} href={'/article.html'} target={'_blank'}/>
          <a className={indexStyle.aStyle}>博客</a>
          <a className={indexStyle.aStyle}>下载</a>
          <a className={indexStyle.aStyle}>学习</a>
          <a className={indexStyle.aStyle}>社区</a>
          <a className={indexStyle.aStyle}>GitCode</a>
          <a className={indexStyle.aStyle}>InsCode</a>
          <HomeSearch onSearch={this.onSearch}/>
          <Button className={indexStyle.loginButton} onClick={this.login}>登录</Button>
          <a className={indexStyle.aStyle}>消息</a>
          <a className={indexStyle.aStyle}>历史</a>
          <a className={indexStyle.aStyle}>创作中心</a>
          <Button className={indexStyle.publishBtn} type={'primary'}>
            <PlusCircleOutlined style={{ verticalAlign: 3 }}/>
            <span>发布</span>
          </Button>
        </Space>
      </div>
    )
  }

}

const mapStateToProps = (state) => {
  return {
    login: state.getIn(['showLoginModule', 'showLogin'])
  }
}
export default connect(mapStateToProps)(HeaderTool)
